$(function(){
    //获取照片
    var imgs = $('.imgs img')
    //获取按钮
    var btns = $('.btns span')
    //获取当前照片索引值
    var index = 0
    //定时器
    var timebar
    time()
    toggle()
    click()
    //默认显示图片第一张
    imgs.eq(index).css('left',0);
    //定时切换照片
    function time(){
         timebar = setInterval(change, 3000);
    }
    //图片自动切换
    function change() {
        //上一张图片向左移动800px
        imgs.eq(index).animate({
            left:-800
        },500);
        //显示下一张
        index++;
        //判断边界
        if(index>4) index = 0;
        //当前图片向左移动600
        imgs.eq(index).css('left',800).animate({
            left:0
        },500)
        //处理小圆点
        btns.eq(index).addClass('chose').siblings().removeClass('chose')
    }
    //点击图标切换图片
    function toggle(){
      $('.prev').click(function(){
          clearInterval(timebar)
          imgs.eq(index).animate({
              left:800
          },500)
          index--;
          if(index<0) index = 4;
          imgs.eq(index).css('left',-800).animate({
              left:0
          },500,function(){
              btns.eq(index).addClass('chose').siblings().removeClass('chose')
              time();

          })
      })
      $('.next').click(function(){
          clearInterval(timebar)
          imgs.eq(index).animate({
              left:-800
          },500)
          index++;
          if(index>4) index = 0;
          imgs.eq(index).css('left',800).animate({
              left:0
          },500,function(){
              btns.eq(index).addClass('chose').siblings().removeClass('chose')
              time();
          })
      })
    }
    //点击小点切换图片
    function click() {
        btns.click(function(){
            console.log($(this).index())
            clearInterval(timebar)
            index = $(this).index()-1
            change()
        })
    }
})